import React, { Fragment } from 'react';
import { ColumnsType } from 'antd/es/table';
import { Card, Table, Button } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import InvADJModal from './InvADJModal';
import InvADJSearch from './InvADJSearch';

interface User {
  key: number;
  adjustment: string;
  examineMem: string;
  whse: string;
  count: string;
  status: string;
  examineDate: string;
  adjustMentId: string;
  adjustMentMem: string;
  adjustMentDate: string;
}
class ViewPage extends React.Component<any, any> {
  constructor(props: any) {
    super(props);
    this.state = {
      visible: false,
      formVals: {},
      defaultParams: {},
      editStatus: false,
      list: [],
    };
  }

  componentDidMount() {
    this.query();
  }
  query = () => {
    //获取数量调整list 接口
    this.setState({
      list: [
        {
          adjustment: '数据冲突',
          examineMem: '王敏川',
          whse: '待检仓',
          count: '381',
          status: '正常',
          examineDate: '2021-6-21',
          adjustMentId: '20210621001',
          adjustMentMem: '曹金硕',
          adjustMentDate: '2021-6-22',
        },
      ],
    });
  };
  /**
   * 控制更新模态框显示
   * @param {boolean} visible 是否显示
   * @param {object} formVals 模态框默认值
   * @param {boolean} editStatus 是否编辑模式
   */
  switchVisible = (visible = false, formVals = {}, editStatus = false) => {
    this.setState({
      visible,
      formVals,
      editStatus,
    });
  };
  handleSubmit = async (values: any) => {
    const { dispatch } = this.props;
    /// if (editStatus) {
    // await dispatch({
    //   type: '#/edit',
    //   payload,
    // });
    // } else {
    // await dispatch({
    //   type: '#/add',
    //   payload,
    // });
    // }
    this.switchVisible();
    this.query();
  };
  /**
   *
   * @returns 搜索
   */
  handleSearch = (values: any) => {
    this.setState(
      {
        params: { ...values },
        pageNumber: 1,
      },
      this.query,
    );
  };
  render() {
    const columns: ColumnsType<User> = [
      {
        title: '序号',
        key: 'index',
        width: 80,
        render: (_: any, __: any, i: any) => i + 1,
      },
      {
        title: '订单编号',
        dataIndex: 'adjustMentId',
        width: 160,
      },
      {
        title: '调整原因 ',
        dataIndex: 'adjustment',
        width: 180,
      },
      {
        title: '调整仓库',
        dataIndex: 'whse',
        width: 150,
      },
      {
        title: '数量',
        dataIndex: 'count',
        width: 120,
      },
      {
        title: '审核日期',
        dataIndex: 'examineDate',
        width: 150,
      },
      {
        title: '调整人',
        dataIndex: 'adjustMentMem',
        width: 120,
      },
      {
        title: '调整日期',
        dataIndex: 'adjustMentDate',
        width: 150,
      },
      {
        title: '操作',
        key: 'action',
        fixed:"right",
        render: (_: any, record: any) => (
          <Fragment>
            <Button
              size="small"
              type="primary"
              title="编辑"
              onClick={() => this.switchVisible(true, { ...record }, true)}
            >
              编辑
            </Button>
            {/* <Button
                        type="danger"
                        size="small"
                        title="删除"
                        onClick={() => this.handleDelete(record.ID)}
                        style={{ marginLeft: 12 }}
                      >
                        删除
                      </Button> */}
          </Fragment>
        ),
      },
    ];
    const { visible, formVals, defaultParams, list } = this.state;
    return (
      <PageHeaderWrapper title={false}>
        <Card title="数量调整">
          <InvADJSearch
            defaultParams={{ ...defaultParams }}
            onSearch={this.handleSearch}
          ></InvADJSearch>
          <Table
            rowKey="adjustMentId"
            size="small"
            columns={columns}
            dataSource={list}
            bordered
            scroll={{ x: 'max-content' }}
          />
        </Card>
        <InvADJModal
          visible={visible}
          formVals={formVals}
          onCancel={this.switchVisible}
          onSubmit={this.handleSubmit}
        />
      </PageHeaderWrapper>
    );
  }
}
export default ViewPage;
